<!-- 历史记录选择 -->
<template>
    <!-- 选择时间遮罩 -->
    <transition name='fade'>
        <div class="history-picker mask" v-show="historyMaskShow">
            <div class="mask-close" @click="pickerClose()"></div>
            <transition name='slideup'>
                <div class="picker-box" @touchmove.stop  v-show="historyMaskShow">
                    <div class="picker-close" @click="pickerClose()"></div>
                    <div :class="['history-list',{'isone':historyList.length==1}]">
                        <ul>
                            <li :class="['history-item clearfix',{'istest':item.taskCategory==2}]" v-for="(item,index) in historyList" :key="index" @click="choseFun(item,index)">
                                <span class="left">{{item.taskCategory==2 ? '考试任务':'打卡任务'}}</span>
                                <i :class="['left',{'ischose':choseIndex==index}]">{{item.date}}</i>
                            </li>
                        </ul>
                    </div>
                </div>
            </transition>
        </div>
    </transition>
</template>
<script>
// import { axGet } from '@/api/index'
import { getTimeStr } from '@/assets/js/base'

export default {
    name: 'History',
    props:[
        "historyMaskShow",
        "choseIndex",
        "isLast",
        "lastTask",
    ],
    data () {
        return {
            historyList:[],
            taskDateList:[],
        }
    },
    watch:{
        gradeMaskShow(newVal,oldVal){
            if(newVal){
                touchFalse() 
            }else{
                touchTrue()
            }
        },
    },
    created:function() {
        this.historyList=JSON.parse(sessionStorage.historyList) 
        if(this.isLast==1){
            this.historyList.unshift(this.lastTask)
            sessionStorage.setItem("historyList",JSON.stringify(this.historyList))
        }
        this.historyList.forEach((item,i)=>{
            let createTime=item.createTime.replace( /-/g, '/')
            let date=new Date(createTime)
            let startDate=getTimeStr(date)
            let endDate=getTimeStr(new Date(date.getTime()+1000*60*60*24*(item.dayCount-1)))
            this.$set(item,'date',startDate+'~'+endDate)
            let list={
                date:item.date,
                type:item.taskCategory,
            }
            this.taskDateList.push(list.date)
        })
    },
    mounted:function(){

    },
    methods:{
        // 选时间段
        choseFun(item,index){
            this.$emit('choseFun',item,index)
        },
        pickerClose(){
            this.$emit('pickerClose')
        },
    }
}
</script>
<style type="text/css" scoped>
    
</style>